<style lang="less">
    @import "singleDebit.less";
</style>
<template>
    <div>
        <Card>
            <Row>
                <Form  ref="searchForm" :model="searchForm" inline :label-width="90" class="search-form">
                    <div class="search">
                        <Row>
                            <Col align="left">
                                <Form-item label="客户姓名" prop="custName">
                                    <Input type="text" v-model="searchForm.custName" clearable placeholder="客户姓名"
                                           />
                                </Form-item>
                                <Form-item label="扣款银行" prop="deductBank">
                                    <Select v-model="searchForm.deductBank"  clearable placeholder="请选择扣款银行">
                                        <Option v-for="item in dataDic.deductBank" :value="item.value" :label="item.title" :key="item.value">{{ item.title }}</Option>
                                    </Select>
                                </Form-item>
                                <Form-item label="合同号码" prop="contractNo">
                                    <Input type="text" v-model="searchForm.contractNo" clearable placeholder="合同号码"
                                    />
                                </Form-item>
                            </Col>
                        </Row>
                    </div>
                    <Row>
                        <Col align="middle">
                            <Form-item>
                                <Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button>
                                <Button @click="handleReset" type="primary" icon="ios-trash">重置</Button>
                            </Form-item>
                        </Col>
                    </Row>
                    <Row>
                        <Table :loading="loading" border :columns="columns" :data="data" sortable="custom"
                               @on-sort-change="changeSort" @on-selection-change="showSelect" ref="table">
                            <template slot-scope="{ row, index }" slot="action">
                                <Button type="primary" size="small" @click="debit(row)">扣款</Button>
                            </template>
                            <template slot-scope="{ row, index }" slot="debitSignBank">
                                <span>{{setDictTitleByType("deductBank",row.debitSignBank)}}</span>
                            </template>
                        </Table>
                    </Row>
                    <Row type="flex" justify="end" class="page">
                        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize"
                              @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]"
                              size="small" show-total show-elevator show-sizer></Page>
                    </Row>
                </Form>
            </Row>
        </Card>
    </div>
</template>

<script>

    import {
        getByTypes
    } from "_p/basic/api/admin/datadic";

    import {
        getDebitContract,
        singleDebitSend
    } from "@/projects/basic/api/contract/debit-management/debitManagement";
    import contractDebitRecord from "./contractDebitRecord";


    export default {
        name: "single-debit",
        comments:{
        },
        data() {
            return {
                searchForm:{custName:"",deductBank:"",contractNo:""},
                data:[],
                total: 0,
                selectDate: null,
                dicKeys: [
                    "deductBank","feeType"
                ],
                dataDic:{},
                loading: false,
                columns: [
                    {
                        type: 'expand',
                        width: 30,
                        render: (h, table) => {
                            return h(contractDebitRecord, {
                                props: {
                                    recordList: table.row.recordList,
                                    feeTypes:this.getDic("feeType")
                                }
                            })
                        }
                    },
                    {title: "操作",key: "action",minWidth: 80,align: "center",slot: "action"},
                    {title: "合同号码",key: "contractNo",minWidth: 100,align: "center"},
                    {title: "客户姓名",key: "custName",minWidth: 100,align: "center"},
                    {title: "扣款渠道",key: "debitSignBank",minWidth: 100,align: "center",slot: "debitSignBank"},
                    {title: "手机号码",key: "phone",minWidth: 100,align: "center"},
                    {title: "应收金额",key: "amount",minWidth: 100,align: "center"},
                    {title: "已收金额",key: "succeedAmt",minWidth: 100,align: "center"},
                    {title: "未收金额",key: "unSucceedAmt",minWidth: 100,align: "center"},
                    {title: "应收日期",key: "planDate",minWidth: 100,align: "center"},
                    {title: "逾期天数",key: "overdueDays",minWidth: 100,align: "center"}
                ],
                selectCount: 0,
            }
        },
        methods:{
            debit(v){
                let params = {
                    contractNo:v.contractNo
                }
                this.loading = true;
                singleDebitSend(params).then(res => {
                    if (res.code === "0000") {
                        this.$Message.success(res.data);
                        this.getDebitContract();
                    }else{
                        this.$Message.error(res.data);
                        this.loading = false;
                    }
                }).catch(e =>{
                    this.loading = false;
                });
            },
            showBatchDetail(v){
                /**
                 *
                 */
                this.afs.newTab(this,
                    'projects/basic/pages/contract/debit-management/batch/debitBatchDetail',
                    '扣款批次详情，批次号' + v.batchNo,
                    'ios-list',
                    {batchId:v.id},
                    '0',
                    [],
                    true)
            },
            handleSearch() {
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.getDebitContract();
            },
            handleReset() {
                this.$refs.searchForm.resetFields();
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.selectDate = null;
                this.searchForm.startDate = "";
                this.searchForm.endDate = "";

                // 重新加载数据
                this.getDebitContract();
            },
            selectDateRange(v) {
                if (v) {
                    this.searchForm.startDate = v[0];
                    this.searchForm.endDate = v[1];
                }
            },
            changePage(v) {
                this.searchForm.pageNumber = v;
                this.getDebitContract();
            },
            changePageSize(v) {
                this.searchForm.pageSize = v;
                this.getDebitContract();
            },
            initDataDic(){
                let self = this;
                getByTypes(this.dicKeys).then(res => {
                    if (res.code === "0000" && res.data) {
                        self.dataDic = res.data;
                    }
                });
            },
            getDic(v){
                let dic = []
                switch(v) {
                    case "deductBank":
                        dic = this.dataDic.deductBank;
                        break;
                    case "feeType":
                        dic = this.dataDic.feeType;
                        break;
                    default:
                }
                return dic;
            },
            setDictTitleByType(v1,v2){
                let dic = {}
                if(!this.getDic(v1)) return '';
                this.getDic(v1).forEach(column => {
                    if(column.value === v2){
                        dic = column;
                    }
                });
                return dic.title;
            },
            changeSort(e) {
                this.searchForm.sort = e.key;
                this.searchForm.order = e.order;
                if (e.order === "normal") {
                    this.searchForm.order = "";
                }
                this.getDebitContract();
            },
            showSelect(e) {
                this.selectList = e;
                this.selectCount = e.length;
            },
            getDebitContract(){
                this.loading = true;
                getDebitContract(this.searchForm).then(res => {
                    this.loading = false;
                    if (res.code === "0000") {
                        this.data = res.data.records;
                        this.total = res.data.total;
                    }
                });
                this.selectCount=0;
            },
            init(){
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.getDebitContract();
            },
        },
        mounted() {
            this.initDataDic();
            this.init();
        }
    }
</script>

<style scoped>

</style>
